<!DOCTYPE html>
<html lang="en">

	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta charset="utf-8" />
		<title>发展建议管理</title>

		<meta name="description" content="Dynamic tables and grids using jqGrid plugin" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

		<!-- bootstrap & fontawesome -->
		<link rel="stylesheet" href="/assets/css/bootstrap.min.css" />
		<link rel="stylesheet" href="/assets/font-awesome/4.5.0/css/font-awesome.min.css" />

		<!-- page specific plugin styles -->
		<link rel="stylesheet" href="/assets/css/jquery-ui.min.css" />
		<link rel="stylesheet" href="/assets/css/bootstrap-datepicker3.min.css" />
		<link rel="stylesheet" href="/assets/css/ui.jqgrid.min.css" />

		<!-- text fonts -->
		<link rel="stylesheet" href="/assets/css/fonts.googleapis.com.css" />

		<!-- ace styles -->
		<link rel="stylesheet" href="/assets/css/ace.min.css" class="ace-main-stylesheet" id="main-ace-style" />

		<!--[if lte IE 9]>
			<link rel="stylesheet" href="/assets/css/ace-part2.min.css" class="ace-main-stylesheet" />
		<![endif]-->
		<link rel="stylesheet" href="/assets/css/ace-skins.min.css" />
		<link rel="stylesheet" href="/assets/css/ace-rtl.min.css" />

		<!--[if lte IE 9]>
		  <link rel="stylesheet" href="/assets/css/ace-ie.min.css" />
		<![endif]-->

		<!-- inline styles related to this page -->

		<!-- ace settings handler -->
		<script src="/assets/js/ace-extra.min.js"></script>

		<!-- HTML5shiv and Respond.js for IE8 to support HTML5 elements and media queries -->

		<!--[if lte IE 8]>
		<script src="/assets/js/html5shiv.min.js"></script>
		<script src="/assets/js/respond.min.js"></script>
		<![endif]-->
	</head>

	<body class="no-skin">
		<div id="navbar" class="navbar navbar-default          ace-save-state">
			<div class="navbar-container ace-save-state" id="navbar-container">
				<button type="button" class="navbar-toggle menu-toggler pull-left" id="menu-toggler" data-target="#sidebar">
					<span class="sr-only">Toggle sidebar</span>

					<span class="icon-bar"></span>

					<span class="icon-bar"></span>

					<span class="icon-bar"></span>
				</button>

				<div class="navbar-header pull-left">
					<a href="/views/index.html" class="navbar-brand">
						<small>
							<i class="fa fa-leaf"></i>
							学生发展数据综合评价与分析系统
						</small>
					</a>
				</div>

				<div class="navbar-buttons navbar-header pull-right" role="navigation">
					<ul class="nav ace-nav">

						<li class="light-blue dropdown-modal">
							<a data-toggle="dropdown" href="#" class="dropdown-toggle">

								<img class="nav-user-photo us_photo" src="/assets/images/avatars/blank.jpg" alt="个人头像" style="background-color:#fff" />

								<span class="user-info">
							       <span id="us_name"></span>
								</span>

								<i class="ace-icon fa fa-caret-down"></i>
							</a>

							<ul class="user-menu dropdown-menu-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">
								<li>
									<a id="setting" target="_blank">
										<i class="ace-icon fa fa-cog"></i> 设置
									</a>
								</li>

								<li>
									<a id="profile" target="_blank">
										<i class="ace-icon fa fa-user"></i> 个人信息
									</a>
								</li>

								<li class="divider"></li>

								<li>
									<a href="/login.html" onclick="logout()">
										<i class="ace-icon fa fa-power-off"></i> 注销
									</a>
								</li>
							</ul>
						</li>
					</ul>
				</div>
			</div>
			<!-- /.navbar-container -->
		</div>

		<div class="main-container ace-save-state" id="main-container">
			<script type="text/javascript">
				try {
					ace.settings.loadState('main-container')
				} catch(e) {}
			</script>

			<div id="sidebar" class="sidebar                  responsive                    ace-save-state">
				<script type="text/javascript">
					try {
						ace.settings.loadState('sidebar')
					} catch(e) {}
				</script>

				<div class="sidebar-shortcuts" id="sidebar-shortcuts">
					<div class="sidebar-shortcuts-large" id="sidebar-shortcuts-large">
						<button class="btn btn-success">
							<i class="ace-icon fa fa-signal"></i>
						</button>

						<button class="btn btn-info">
							<i class="ace-icon fa fa-pencil"></i>
						</button>

						<button class="btn btn-warning">
							<i class="ace-icon fa fa-users"></i>
						</button>

						<button class="btn btn-danger">
							<i class="ace-icon fa fa-cogs"></i>
						</button>
					</div>

					<div class="sidebar-shortcuts-mini" id="sidebar-shortcuts-mini">
						<span class="btn btn-success"></span>

						<span class="btn btn-info"></span>

						<span class="btn btn-warning"></span>

						<span class="btn btn-danger"></span>
					</div>
				</div>
				<!-- /.sidebar-shortcuts -->

				<ul class="nav nav-list">
					<li class="">
						<a href="/views/index.html">
							<i class="menu-icon fa fa-tachometer"></i>
							<span class="menu-text"> 我的首页 </span>
						</a>

						<b class="arrow"></b>
					</li>

					<li class="active open">
						<a href="#" class="dropdown-toggle">
							<i class="menu-icon fa fa-tasks"></i>
							<span class="menu-text"> 数据管理 </span>

							<b class="arrow fa fa-angle-down"></b>
						</a>

						<b class="arrow"></b>

						<ul class="submenu">

							<li class="">
								<a href="/views/dataManage/studentManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 学生
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/teacherManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 教师
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/majorManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 专业
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/classroomManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 班级
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/scoreManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 成绩
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/certificateManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 证书
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/competitionManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 竞赛
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/innovationTrainManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 创新训练
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/scholarshipManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 奖学金
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/excellentStudentManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 优秀学生
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/pushExcellentManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 推优
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/partyMemberManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 入党
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/postGraduateManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 考研录取
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/volunteerManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 志愿服务
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/dataManage/dutyManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 学生干部
								</a>

								<b class="arrow"></b>
							</li>
							<li class="active">
								<a href="/views/dataManage/adviceManage.html">
									<i class="menu-icon fa fa-caret-right"></i> 发展建议
								</a>

								<b class="arrow"></b>
							</li>

						</ul>
					</li>

					<li class="">
						<a href="#" class="dropdown-toggle">
							<i class="menu-icon fa fa-bar-chart-o"></i>
							<span class="menu-text"> 数据分析 </span>

							<b class="arrow fa fa-angle-down"></b>
						</a>

						<b class="arrow"></b>

						<ul class="submenu">
							<li class="">
								<a href="#" class="dropdown-toggle">
									<i class="menu-icon fa fa-caret-right"></i> 个人情况分析
									<b class="arrow fa fa-angle-down"></b>
								</a>

								<b class="arrow"></b>

								<ul class="submenu">
									<li class="">
										<a href="/views/dataAnalysis/student/personalGrade.html">
											<i class="menu-icon fa fa-leaf green"></i>个人成绩查询
										</a>

										<b class="arrow"></b>
									</li>
									<li class="">
										<a href="/views/dataAnalysis/student/personalAllInfo.html">
											<i class="menu-icon fa fa-leaf green"></i>发展综合分析
										</a>

										<b class="arrow"></b>
									</li>

								</ul>
							</li>

							<li class="">
								<a href="/views/dataAnalysis/dorm/dormAtmosphere.html">
									<i class="menu-icon fa fa-caret-right"></i> 宿舍情况分析
								</a>

								<b class="arrow"></b>
							</li>

							<li class="">
								<a href="/views/dataAnalysis/classroom/classAtmosphere.html">
									<i class="menu-icon fa fa-caret-right"></i> 班级情况分析
								</a>

								<b class="arrow"></b>
							</li>

							<li class="">
								<a href="#" class="dropdown-toggle">
									<i class="menu-icon fa fa-caret-right"></i> 整体学业分析
									<b class="arrow fa fa-angle-down"></b>
								</a>

								<b class="arrow"></b>

								<ul class="submenu">
									<li class="">
										<a href="/views/dataAnalysis/all/allGrade.html">
											<i class="menu-icon fa fa-leaf green"></i>学分积欠情况分析
										</a>

										<b class="arrow"></b>
									</li>
									<li class="">
										<a href="/views/dataAnalysis/all/make_up_rebuild.html">
											<i class="menu-icon fa fa-leaf green"></i>补考重修情况分析
										</a>

										<b class="arrow"></b>
									</li>

								</ul>
							</li>

						</ul>
					</li>

					<li class="">
						<a href="#" class="dropdown-toggle">
							<i class="menu-icon fa fa-book"></i>
							<span class="menu-text"> 数据预测 </span>

							<b class="arrow fa fa-angle-down"></b>
						</a>

						<b class="arrow"></b>

						<ul class="submenu">
							<li class="">
								<a href="/views/bigDataAnalysis/courseDependence.html">
									<i class="menu-icon fa fa-caret-right"></i> 课程通过预警
								</a>

								<b class="arrow"></b>
							</li>

							<li class="">
								<a href="/views/bigDataAnalysis/scorePosition.html">
									<i class="menu-icon fa fa-caret-right"></i> 成绩位置预测
								</a>

								<b class="arrow"></b>
							</li>

							<li class="">
								<a href="/views/bigDataAnalysis/postGraduate.html">
									<i class="menu-icon fa fa-caret-right"></i> 考研录取预测
								</a>

								<b class="arrow"></b>
							</li>

							<li class="">
								<a href="/views/bigDataAnalysis/partyMember.html">
									<i class="menu-icon fa fa-caret-right"></i> 入党情况预测
								</a>

								<b class="arrow"></b>
							</li>

						</ul>
					</li>

					<li class="">
						<a href="#" class="dropdown-toggle">
							<i class="menu-icon fa fa-folder-open-o"></i>
							<span class="menu-text"> 文件操作 </span>

							<b class="arrow fa fa-angle-down"></b>
						</a>

						<b class="arrow"></b>

						<ul class="submenu">
							<li class="">
								<a href="/views/file/fileUpload.html">
									<i class="menu-icon fa fa-caret-right"></i> 文件上传
								</a>

								<b class="arrow"></b>
							</li>
							<li class="">
								<a href="/views/file/fileDownload.html">
									<i class="menu-icon fa fa-caret-right"></i> 文件下载
								</a>

								<b class="arrow"></b>
							</li>

						</ul>
					</li>

				</ul>
				<!-- /.nav-list -->

				<div class="sidebar-toggle sidebar-collapse" id="sidebar-collapse">
					<i id="sidebar-toggle-icon" class="ace-icon fa fa-angle-double-left ace-save-state" data-icon1="ace-icon fa fa-angle-double-left" data-icon2="ace-icon fa fa-angle-double-right"></i>
				</div>
			</div>

			<div class="main-content">
				<div class="main-content-inner">
					<div class="breadcrumbs ace-save-state" id="breadcrumbs">
						<ul class="breadcrumb">
							<li>
								<i class="ace-icon fa fa-home home-icon"></i>
								<a href="/views/index.html">我的首页</a>
							</li>

							<li class="active">发展建议管理</li>
						</ul>
						<!-- /.breadcrumb -->

					</div>

					<div class="page-content">

						<div class="row">
							<div class="col-xs-12">
								<!-- PAGE CONTENT BEGINS -->
								<div class="alert alert-info">
									<button class="close" data-dismiss="alert">
										<i class="ace-icon fa fa-times"></i>
									</button>

									<i class="ace-icon fa fa-hand-o-right"></i> 此表可进行对发展建议信息的管理.
								</div>
								<div class="row" style="margin-bottom: 5px;">
									<div class="row" style="float:right;margin-right: 12px;">
										<div class="btn-group">
											<button data-toggle="dropdown" class="btn btn-success bigger-120 dropdown-toggle">
												   导入现有数据
													<i class="ace-icon fa fa-angle-down icon-on-right"></i>
												</button>

											<ul class="dropdown-menu dropdown-info dropdown-menu-right">
												<li>
													<a href="/advice/downloadTemplate">下载导入摸板</a>
												</li>

												<li class="divider"></li>

												<li>

													<form method="POST" enctype="multipart/form-data" id="form1" action="uploadExcel/upload.do">

														<div style="margin-left: 10px;"><input id="upfile" type="file" name="upfile"></div>
														<div style="margin-top: 15px;margin-left: 10px;">
															<a href="#" onclick="importData()">由模版导入数据</a>
														</div>
													</form>

												</li>
											</ul>
										</div>
										<div class="btn-group">
											<button data-toggle="dropdown" class="btn btn-warning bigger-120 dropdown-toggle">
													导出查询数据
													<i class="ace-icon fa fa-angle-down icon-on-right"></i>
												</button>

											<ul class="dropdown-menu dropdown-info dropdown-menu-right">
												<li>
													<a href="#" onclick="exportSinglePage()">导出本页数据</a>
												</li>

												<li class="divider"></li>

												<li>
													<a href="#" onclick="exportAllData()">导出全部数据</a>
												</li>
											</ul>
										</div>
									</div>
								</div>

								<table id="grid-table"></table>

								<div id="grid-pager"></div>

								<!-- PAGE CONTENT ENDS -->
							</div>
							<!-- /.col -->
						</div>
						<!-- /.row -->
					</div>
					<!-- /.page-content -->
				</div>
			</div>
			<!-- /.main-content -->

			<div class="footer">
				<div class="footer-inner">
					<div class="footer-content">
						<span class="bigger-120">
							<span class="blue bolder" style="margin-right: 10px;">学生发展数据综合评价与分析系统</span> 苏州科技大学 &copy; 2018-2019
						</span>

					</div>
				</div>
			</div>

			<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
				<i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
			</a>
		</div>
		<!-- /.main-container -->

		<!-- basic scripts -->

		<!--[if !IE]> -->
		<script src="/assets/js/jquery-2.1.4.min.js"></script>
		<script src="/assets/js/jquery.form.js"></script>
		<script src="/assets/js/jquery.cookie.js"></script>
		<script src="/assets/js/sddb.util.js"></script>

		<!-- <![endif]-->

		<!--[if IE]>
<script src="/assets/js/jquery-1.11.3.min.js"></script>
<![endif]-->
		<script type="text/javascript">
			if('ontouchstart' in document.documentElement) document.write("<script src='/assets/js/jquery.mobile.custom.min.js'>" + "<" + "/script>");
		</script>
		<script src="/assets/js/bootstrap.min.js"></script>

		<!-- page specific plugin scripts -->
		<script src="/assets/js/bootstrap-datepicker.min.js"></script>
		<script src="/assets/js/jquery.jqGrid.min.js"></script>
		<script src="/assets/js/grid.locale-cn.js"></script>

		<!-- ace scripts -->
		<script src="/assets/js/ace-elements.min.js"></script>
		<script src="/assets/js/ace.min.js"></script>

		<!-- inline scripts related to this page -->

		<STYLE type="text/css">
			/* Jqgrid */
			
			.ui-jqgrid .ui-jqgrid-view {
				font-size: 14px;
			}
			/*修改grid标题的字体大小*/
			
			.ui-jqgrid .ui-jqgrid-pager {
				font-size: 14px;
			}
			/*修改grid标题的字体大小*/
			
			.ui-jqgrid .ui-jqgrid-titlebar {
				font-size: 16px;
			}
			
			.ui-jqdialog-title {
				font-size: 14px;
			}
			
			.ui-jqgrid-sortable {
				font-size: 14px;
			}
			/*修改列名的字体大小*/
			
			.ui-widget-content .jqgrow .ui-row-ltr .ui-jqgrid-view {
				font-size: 14px;
			}
			/*修改表格内容字体,不起作用*/
			
			.CaptionTD {
				font-size: 14px
			}
			
			.fm-button {
				font-size: 14px
			}
			
			.ui-jqdialog {
				font-size: 14px
			}
		</style>

		<script type="text/javascript">
			jQuery(function($) {
				$("#data_export").click(function() {
					var v = JSON.stringify($("#grid-table").jqGrid("getGridParam", "postData").filters);

					alert(v);

				});

			});

			function checkData() {
				var fileDir = $("#upfile").val();
				var suffix = fileDir.substr(fileDir.lastIndexOf("."));
				if("" == fileDir) {
					alert("请选择文件后再上传！");
					return false;
				} else if(".xls" != suffix) {
					alert("请选择后缀名为xls的excel文件！");
					return false;
				}
				return true;

			}
			//导入数据
			function importData() {
				if(checkData()) {
					$('#form1').ajaxSubmit({
						url: '/advice/importExcel.do',
						dataType: 'text',
						success: resutlMsg,
						error: errorMsg
					});

					function resutlMsg(res) {
						alert(decodeURIComponent(res));
						$("#upfile").val("");
					}

					function errorMsg() {
						alert("导入excel出错！");
					}

				}

			}

			//导出当前页数的数据
			function exportSinglePage() {
				//得到查询的参数
				var v = $("#grid-table").jqGrid("getGridParam", "postData");
				//将json格式的数据转化为连接参数以附在请求后方
				location.href = "/advice/exportExcel.do?" + $.param(v);
			}

			//导出所有页数数据
			function exportAllData() {
				var v = $("#grid-table").jqGrid("getGridParam", "postData");
				v.page = -1;
				location.href = "/advice/exportExcel.do?" + $.param(v);

			}
		</script>
		<script type="text/javascript">
			jQuery(function($) {
				var grid_selector = "#grid-table";
				var pager_selector = "#grid-pager";

				var parent_column = $(grid_selector).closest('[class*="col-"]');
				//resize to fit page size
				$(window).on('resize.jqGrid', function() {
					$(grid_selector).jqGrid('setGridWidth', parent_column.width());
				})

				//resize on sidebar collapse/expand
				$(document).on('settings.ace.jqGrid', function(ev, event_name, collapsed) {
					if(event_name === 'sidebar_collapsed' || event_name === 'main_container_fixed') {
						//setTimeout is for webkit only to give time for DOM changes and then redraw!!!
						setTimeout(function() {
							$(grid_selector).jqGrid('setGridWidth', parent_column.width());
						}, 20);
					}
				})

				//if your grid is inside another element, for example a tab pane, you should use its parent's width:
				/**
				$(window).on('resize.jqGrid', function () {
					var parent_width = $(grid_selector).closest('.tab-pane').width();
					$(grid_selector).jqGrid( 'setGridWidth', parent_width );
				})
				//and also set width when tab pane becomes visible
				$('#myTab a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
				  if($(e.target).attr('href') == '#mygrid') {
					var parent_width = $(grid_selector).closest('.tab-pane').width();
					$(grid_selector).jqGrid( 'setGridWidth', parent_width );
				  }
				})
				*/

				jQuery(grid_selector).jqGrid({
					//direction: "rtl",

					url: "/advice/findsome.do",

					//data: grid_data,
					datatype: "json",
					height: 400,
					colNames: ['操作', '', '序号', '建议种类', '种类等级', '具体建议'],
					colModel: [{
							name: 'op',
							index: 'op',
							align: 'center',
							width: 80,
							fixed: true,
							sortable: false,
							resize: false,
							search: false,
							formatter: 'actions',
							formatoptions: {
								keys: true,
								//delbutton: false,//disable delete button
								editOptions: {
									recreateForm: true,
									beforeShowForm: beforeEditCallback
								},
								delOptions: {
									recreateForm: true,
									beforeShowForm: beforeDeleteCallback
								},

							}
						},
						{
							name: '',
							index: '',
							width: 0.1,
							editable: true,
							sortable: false,
							search: false

						},

						{
							name: 'ad_id',
							index: 'ad_id',
							width: 50,
							key: true,
							editable: false,
							edittype: "textarea",
							editoptions: {
								rows: "2",
								cols: "15",
								readonly: true
							}

						},
						{
							name: 'ad_category',
							index: 'ad_category',
							width: 100,
							sortable: false,
							editable: true,
							edittype: "textarea",
							editoptions: {
								rows: "2",
								cols: "15"
							}
						},
						{
							name: 'ad_level',
							index: 'ad_level',
							width: 80,
							sortable: false,
							editable: true,
							edittype: "textarea",
							editoptions: {
								rows: "2",
								cols: "15"
							}
						},
						{
							name: 'ad_suggestion',
							index: 'ad_suggestion',
							width: 550,
							sortable: false,
							editable: true,
							edittype: "textarea",
							editoptions: {
								rows: "4",
								cols: "40"
							}
						}
					],

					viewrecords: true, //是否显示总数  如View 1 - 10 of 23
					rowNum: 10, //每页显示10条
					rowList: [10, 20, 30], //可选的每页显示条数
					pager: pager_selector, //指定工具栏
					altRows: true,

					multiselect: true, //是否支持多选
					//multikey: "ctrlKey",
					multiboxonly: true, //选中行，即可选中行前面的多选框，点击另外一行，此行效果取消，选中当前行，只能实现选中一条

					loadComplete: function() {
						var table = this;
						setTimeout(function() {
							styleCheckbox(table);

							updateActionIcons(table);
							updatePagerIcons(table);
							enableTooltips(table);
						}, 0);
					},

					editurl: "/advice/handleAdvice.do", //nothing is saved
					caption: "发展建议" //表名

					//,autowidth: true,

					/**
					,
					grouping:true, 
					groupingView : { 
						 groupField : ['name'],
						 groupDataSorted : true,
						 plusicon : 'fa fa-chevron-down bigger-110',
						 minusicon : 'fa fa-chevron-up bigger-110'
					},
					caption: "Grouping"
					*/

				});
				$(window).triggerHandler('resize.jqGrid'); //trigger window resize to make the grid get the correct size

				//enable search/filter toolbar
				//jQuery(grid_selector).jqGrid('filterToolbar',{defaultSearch:true,stringResult:true})
				//jQuery(grid_selector).filterToolbar({});

				//switch element when editing inline
				//编辑表格时,yes与no的切换
				function aceSwitch(cellvalue, options, cell) {
					setTimeout(function() {
						$(cell).find('input[type=checkbox]')
							.addClass('ace ace-switch ace-switch-5')
							.after('<span class="lbl"></span>');
					}, 0);
				}
				//enable datepicker
				//编辑表格时,选择日期
				function pickDate(cellvalue, options, cell) {
					setTimeout(function() {
						$(cell).find('input[type=text]')
							.datepicker({
								format: 'yyyy-mm-dd',
								autoclose: true
							});
					}, 0);
				};

				var fn_editSubmit = function(response, postdata) {
					var json = response.responseText;
					alert(json); //显示返回值
				};

				//重写editOptions
				var editOptions = {
					top: 100,
					left: 100,
					width: 600,
					closeOnEscape: true,
					closeAfterEdit: true,
					//afterSubmit: fn_editSubmit
					errorTextFormat: function(data) {
						return 'Error: ' + data.responseText
					}
				};

				//navButtons  底部工具栏的选项按钮
				jQuery(grid_selector).jqGrid('navGrid', pager_selector, { //navbar options
					edit: true,
					editicon: 'ace-icon fa fa-pencil blue',
					add: true,
					addicon: 'ace-icon fa fa-plus-circle purple',
					del: true,
					delicon: 'ace-icon fa fa-trash-o red',
					search: true,
					searchicon: 'ace-icon fa fa-search orange',
					refresh: true,
					refreshicon: 'ace-icon fa fa-refresh green',
					view: true,
					viewicon: 'ace-icon fa fa-search-plus grey',
				}, {
					//编辑
					top: 100,
					left: 100,
					width: 600,
					closeOnEscape: true,
					closeAfterEdit: true,
					//提交后的回调
					afterSubmit: function(response, postdata) {
						if(response.responseText == "success") {
							$(this).jqGrid('setGridParam', {
								datatype: 'json'
							}).trigger('reloadGrid'); //Reloads the grid after edit
							return [true, "编辑成功!"];
						} else {
							$(this).jqGrid('setGridParam', {
								datatype: 'json'
							}).trigger('reloadGrid'); //Reloads the grid after edit
							return [false, decodeURIComponent(response.responseText)]; //Captures and displays the response text on th Edit window
						}
					},

				}, {
					//新增数据

					closeAfterAdd: true,
					recreateForm: true,
					//提交后的回调
					afterSubmit: function(response, postdata) {
						if(response.responseText == "success") {
							$(this).jqGrid('setGridParam', {
								datatype: 'json'
							}).trigger('reloadGrid'); //Reloads the grid after edit
							return [true, "新增成功!"];
						} else {
							$(this).jqGrid('setGridParam', {
								datatype: 'json'
							}).trigger('reloadGrid'); //Reloads the grid after edit
							return [false, decodeURIComponent(response.responseText)]; //Captures and displays the response text on th Edit window
						}
					},

					beforeShowForm: function(e) {

						var form = $(e[0]);
						form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar')
							.wrapInner('<div class="widget-header" />')
						style_edit_form(form);
					}
				}, {
					//delete record form
					recreateForm: true,
					beforeShowForm: function(e) {
						var form = $(e[0]);
						if(form.data('styled')) return false;

						form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
						style_delete_form(form);

						form.data('styled', true);
					},
					onClick: function(e) {
						//alert(1);
					}
				}, {
					//search form
					recreateForm: true,
					closeOnEscape: true,
					closeAfterSearch: true,
					afterShowSearch: function(e) {
						var form = $(e[0]);
						form.closest('.ui-jqdialog').find('.ui-jqdialog-title').wrap('<div class="widget-header" />')
						style_search_form(form);
					},
					afterRedraw: function() {
						style_search_filters($(this));
					},
					multipleSearch: true,
					/**
					multipleGroup:true,
					showQuery: true
					*/
				}, {
					//view record form
					recreateForm: true,
					beforeShowForm: function(e) {
						var form = $(e[0]);
						form.closest('.ui-jqdialog').find('.ui-jqdialog-title').wrap('<div class="widget-header" />')
					}
				})

				function style_edit_form(form) {
					//enable datepicker on "sdate" field and switches for "stock" field
					form.find('input[name=sdate]').datepicker({
						format: 'yyyy-mm-dd',
						autoclose: true
					})

					form.find('input[name=stock]').addClass('ace ace-switch ace-switch-5').after('<span class="lbl"></span>');
					//don't wrap inside a label element, the checkbox value won't be submitted (POST'ed)
					//.addClass('ace ace-switch ace-switch-5').wrap('<label class="inline" />').after('<span class="lbl"></span>');

					//update buttons classes
					var buttons = form.next().find('.EditButton .fm-button');
					buttons.addClass('btn btn-sm').find('[class*="-icon"]').hide(); //ui-icon, s-icon
					buttons.eq(0).addClass('btn-primary').prepend('<i class="ace-icon fa fa-check"></i>');
					buttons.eq(1).prepend('<i class="ace-icon fa fa-times"></i>')

					buttons = form.next().find('.navButton a');
					buttons.find('.ui-icon').hide();
					buttons.eq(0).append('<i class="ace-icon fa fa-chevron-left"></i>');
					buttons.eq(1).append('<i class="ace-icon fa fa-chevron-right"></i>');
				}

				function style_delete_form(form) {
					var buttons = form.next().find('.EditButton .fm-button');
					buttons.addClass('btn btn-sm btn-white btn-round').find('[class*="-icon"]').hide(); //ui-icon, s-icon
					buttons.eq(0).addClass('btn-danger').prepend('<i class="ace-icon fa fa-trash-o"></i>');
					buttons.eq(1).addClass('btn-default').prepend('<i class="ace-icon fa fa-times"></i>')
				}

				function style_search_filters(form) {
					form.find('.delete-rule').val('X');
					form.find('.add-rule').addClass('btn btn-xs btn-primary');
					form.find('.add-group').addClass('btn btn-xs btn-success');
					form.find('.delete-group').addClass('btn btn-xs btn-danger');
				}

				function style_search_form(form) {
					var dialog = form.closest('.ui-jqdialog');
					var buttons = dialog.find('.EditTable')
					buttons.find('.EditButton a[id*="_reset"]').addClass('btn btn-sm btn-info').find('.ui-icon').attr('class', 'ace-icon fa fa-retweet');
					buttons.find('.EditButton a[id*="_query"]').addClass('btn btn-sm btn-inverse').find('.ui-icon').attr('class', 'ace-icon fa fa-comment-o');
					buttons.find('.EditButton a[id*="_search"]').addClass('btn btn-sm btn-purple').find('.ui-icon').attr('class', 'ace-icon fa fa-search');
				}

				function beforeDeleteCallback(e) {
					var form = $(e[0]);
					if(form.data('styled')) return false;

					form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
					style_delete_form(form);

					form.data('styled', true);
				}

				function beforeEditCallback(e) {
					var form = $(e[0]);
					form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
					style_edit_form(form);
				}

				//it causes some flicker when reloading or navigating grid
				//it may be possible to have some custom formatter to do this as the grid is being created to prevent this
				//or go back to default browser checkbox styles for the grid
				function styleCheckbox(table) {
					/**
					$(table).find('input:checkbox').addClass('ace')
					.wrap('<label />')
					.after('<span class="lbl align-top" />')
			
			
					$('.ui-jqgrid-labels th[id*="_cb"]:first-child')
					.find('input.cbox[type=checkbox]').addClass('ace')
					.wrap('<label />').after('<span class="lbl align-top" />');
				*/
				}

				//unlike navButtons icons, action icons in rows seem to be hard-coded
				//you can change them like this in here if you want
				function updateActionIcons(table) {
					/**
					var replacement = 
					{
						'ui-ace-icon fa fa-pencil' : 'ace-icon fa fa-pencil blue',
						'ui-ace-icon fa fa-trash-o' : 'ace-icon fa fa-trash-o red',
						'ui-icon-disk' : 'ace-icon fa fa-check green',
						'ui-icon-cancel' : 'ace-icon fa fa-times red'
					};
					$(table).find('.ui-pg-div span.ui-icon').each(function(){
						var icon = $(this);
						var $class = $.trim(icon.attr('class').replace('ui-icon', ''));
						if($class in replacement) icon.attr('class', 'ui-icon '+replacement[$class]);
					})
					*/
				}

				//replace icons with FontAwesome icons like above
				function updatePagerIcons(table) {
					var replacement = {
						'ui-icon-seek-first': 'ace-icon fa fa-angle-double-left bigger-140',
						'ui-icon-seek-prev': 'ace-icon fa fa-angle-left bigger-140',
						'ui-icon-seek-next': 'ace-icon fa fa-angle-right bigger-140',
						'ui-icon-seek-end': 'ace-icon fa fa-angle-double-right bigger-140'
					};
					$('.ui-pg-table:not(.navtable) > tbody > tr > .ui-pg-button > .ui-icon').each(function() {
						var icon = $(this);
						var $class = $.trim(icon.attr('class').replace('ui-icon', ''));

						if($class in replacement) icon.attr('class', 'ui-icon ' + replacement[$class]);
					})
				}

				function enableTooltips(table) {
					$('.navtable .ui-pg-button').tooltip({
						container: 'body'
					});
					$(table).find('.ui-pg-div').tooltip({
						container: 'body'
					});
				}

				//var selr = jQuery(grid_selector).jqGrid('getGridParam','selrow');

				$(document).one('ajaxloadstart.page', function(e) {
					$.jgrid.gridDestroy(grid_selector);
					$('.ui-jqdialog').remove();
				});
			});
		</script>
	</body>

</html>